<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div class="index-left-block">
        <h2>全部课程</h2>
        <div v-for="product in productList">
            <h3>{{product.title}}</h3>
            <ul>
                <li v-for="item in product.list"><a :href="item.url">{{item.name}}</a></li>
            </ul>
            <div v-if="!product.last" class="hr">2</div>
        </div>
    </div>
    <script type="text/javaScript"  charset="UTF-8" src="../JS文件/vue.js"></script>
    <script>
        var vm = new Vue({
            el:".index-left-block",
            data:{
                productList:{
                    pc:{
                        title:"前端技术",
                        list:[
                            {
                              name:"HTML+CSS",
                              url:"http;//html.com"
                            },
                            {
                                name:'JavaScript',
                                url:'http://JavaScript.com'
                            },
                            {
                                name:'Vue/React',
                                url:'http://Vue.com',
                            },
                            {
                                name:'Node.js',
                                url:'http://node.js'
                            }
                        ]
                    },
                    app:{
                        title:"前端技术",
                        list:true,
                        list:[
                            {
                              name:"HTML+CSS",
                              url:"http;//html.com"
                            },
                            {
                                name:'JavaScript',
                                url:'http://JavaScript.com'
                            },
                            {
                                name:'Vue/React',
                                url:'http://Vue.com',
                            },
                            {
                                name:'Node.js',
                                url:'http://node.js'
                            }
                        ]
                    }
                }
            }
        })
    </script>
</body>
</html>